<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/icons-extra.css" rel="stylesheet" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<style>
			body {
				line-height: initial;
			}
			
			.head {
				height: 40px;
			}
			
			#head {
				line-height: 40px;
			}
			
			.head-img {
				width: 40px;
				height: 40px;
			}
			
			#head-img1 {
				position: absolute;
				bottom: 10px;
				right: 40px;
				width: 40px;
				height: 40px;
			}
			
			.mui-table-view-cell {
				margin: 0 auto;
				font-size: 14px;
				color: #666;
			}
			
			.mui-btn {
				border: 1px solid #25CDDA;
				width: 300px;
				background-color: #25CDDA;
			}
			
			.mui-btn:active {
				border: 1px solid #58dde8!important;
				background-color: #58dde8!important;
			}
			
			.right-text {
				float: right;
				margin-right: 20px;
				color: darkgray;
			}
			
			.mui-badge {
				font-size: 14px;
			}
			
			.auth {
				background-color: #25CDDA;
				margin-right: 15px;
			}
			
			.mui-icon-extra,
			.mui-icon {
				font-size: 20px;
				color: #27CDDB;
			}
			
			.mui-bar-nav {
				background: #27CDDB;
			}
			
			.mui-action-back,
			.mui-title,
			.mui-action-back:active {
				color: #FFFFFF;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title" id="title">设置</h1>
		</header>
		<div class="mui-content">
			<div class="mui-scroll">
				<ul class="mui-table-view" style="margin-top: 5px;">
					<li class="mui-table-view-cell">
						<a id="head" class="mui-navigate-right"><span class="mui-icon mui-icon-camera"></span>头像
							<span class="mui-pull-right head">
									<img class="head-img mui-action-preview" id="head-img1" src="../images/default-headImg.jpg"/>
							</span>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a><span class="mui-icon mui-icon-phone"></span>手机号<span id="mobile" class="right-text"></span></a>
					</li>
					<li class="mui-table-view-cell" onclick="openHtml('modify_nickname','nickname-modify.html');">
						<a class="mui-navigate-right"><span class="mui-icon mui-icon-star"></span>昵称<span id="nickname" class="right-text">去修改</span></a>
					</li>
					<li class="mui-table-view-cell" onclick="openHtml('modify_password','password-modify.html');">
						<a class="mui-navigate-right"><span class="mui-icon mui-icon-locked"></span>登陆密码<span class="right-text">去修改</span></a>
					</li>
					<li class="mui-table-view-cell" onclick="openHtml('modify_jiaoyipassword','jiaoyipassword-modify.html');">
						<a class="mui-navigate-right"><span class="mui-icon-extra mui-icon-extra-prech"></span>支付密码<span id="paystatus" class="right-text">去修改</span></a>
					</li>

				</ul>

				<ul class="mui-table-view" style="margin-top: 5px;">
					<li class="mui-table-view-cell" onclick="openHtml('alipay','alipay-modify.html');">
						<a class="mui-navigate-right"><span class="mui-icon-extra mui-icon-extra-alipay"></span>支付宝<span id="alipay" class="right-text">去修改</span></a>
					</li>

					<li class="mui-table-view-cell" onclick="openHtml('weixin','wechat-modify.html');">
						<a class=" mui-navigate-right"><span class="mui-icon mui-icon-weixin"></span>微信<span id="wechat" class="right-text">去修改</span></a>
					</li>
					<li class="mui-table-view-cell" onclick="openHtml('bank','bank-modify.html');">
						<a class="mui-navigate-right"><span class="mui-icon-extra mui-icon-extra-card"></span>银行卡<span id="bank_card_number" class="right-text">未添加</span></a>
					</li>
					<li class="mui-table-view-cell" onclick="openHtml('nameauth','realname-auth.html');">
						<a class="mui-navigate-right" id="auth"><span class="mui-icon mui-icon-personadd"></span>实名认证<span id="auth_status" class="mui-badge mui-badge-primary ">未认证</span></a>
					</li>
					<li class="mui-table-view-cell">
						<a><span class="mui-icon mui-icon-flag"></span>版本号<span id="version" class="right-text"></span></a>
					</li>
				</ul>

				<div class="mui-button-row" style="margin-bottom: 20px;margin-top: 10px;" onclick="exitLogin();">
					<button type="button" class="mui-btn mui-btn-primary" onclick="return false;">退出登陆</button>&nbsp;&nbsp;
				</div>
			</div>
		</div>

		<script src="../js/mui.min.js"></script>
		<script type="text/javascript" src="../js/jquery-1.8.3.min.js "></script>
		<script type="text/javascript" src="../js/public.js"></script>
		<script type="text/javascript">
			mui.init({
				swipeBack: true
			});

			var member = null;
			mui.plusReady(function() {
				plus.runtime.getProperty(plus.runtime.appid, function(inf) {
					document.getElementById("version").innerText = "v" + inf.version;
				});
				member = JSON.parse(plus.storage.getItem("member"));
				if(member.headImg) {
					document.getElementById("head-img1").src = member.headImg;
				}
				document.getElementById("mobile").innerText = member.mobile;
			});

			//添加setUserState自定义事件
			window.addEventListener("setUserState", function(event) {
				member = JSON.parse(plus.storage.getItem("member"));
				var nickname = member.nickname;
				var payword = member.payword;
				var alipay = member.alipay;
				var wechat = member.wechat;
				var auth_status = member.authStatus;
				var bank_card_number = member.bankCardNumber;

				if(!nickname) {
					$("#nickname").text("去设置");
				} else {
					$("#nickname").text("去修改 ");
				}

				if(!payword) {
					$("#paystatus").text("去设置");
				} else {
					$("#paystatus").text("去修改 ");
				}

				if(!alipay) {
					$("#alipay").text("去绑定 ");
				} else {
					$("#alipay").text("去修改 ");
				}

				if(!wechat) {
					$("#wechat").text("去绑定 ");
				} else {
					$("#wechat").text("去修改");
				}

				if(!auth_status) {
					$("#auth_status").text("未认证");
				} else {
					if(auth_status == 0) {
						$("#auth_status").text("未认证");
					} else if(auth_status == 1) {
						$("#auth_status").text("审核中");
					} else if(auth_status == 2) {
						$("#auth_status").text("未通过");
						$("#auth_status").removeClass("mui-badge-primary");
						$("#auth_status").addClass("mui-badge-danger");

					} else {
						$("#auth").removeClass("mui-navigate-right");
						$("#auth_status").addClass("auth");
						$("#auth_status").text("已认证");
					}
				}

				if(!bank_card_number) {
					$("#bank_card_number").text("去绑定 ");
				} else {
					$("#bank_card_number").text("去修改 ");
				}
			});

			function openHtml(mid, murl) {
				if(3 == member.authStatus && mid == 'nameauth') {
					return;
				}
				mui.openWindow({
					id: mid,
					url: murl
				});
			}

			//退出登陆
			function exitLogin() {
				plus.storage.setItem("tooken", "");
				var index = plus.webview.getLaunchWebview();
				index.show();
				var wvs = plus.webview.all();
				for(var i = 0; i < wvs.length; i++) {
					if(wvs[i].id == index.id) {
						continue;
					}
					wvs[i].hide();
					wvs[i].close();
				}
			}

			//更换头像
			mui(".mui-table-view-cell").on("tap", "#head", function(e) {
				if(mui.os.plus) {
					var a = [{
						title: "拍照"
					}, {
						title: "从手机相册选择 "
					}];
					plus.nativeUI.actionSheet({
						cancel: "取消 ",
						buttons: a
					}, function(b) {
						switch(b.index) {
							case 0:
								break;
							case 1:
								getImage();
								break;
							case 2:
								galleryImg();
								break;
							default:
								break
						}
					})
				}

			});

			//拍照  
			function getImage() {
				var cmr = plus.camera.getCamera();
				cmr.captureImage(function(p) {
					plus.io.resolveLocalFileSystemURL(p, function(entry) {
						var localurl = entry.toLocalURL(); //        
						document.getElementById("head-img1").src = localurl;
						upload({
							name: "file", //这个值服务器会用到，作为file的key      
							path: localurl
						});
					});
				});
			}

			function galleryImg() {
				plus.gallery.pick(function(a) {
						document.getElementById("head-img1").src = a;
						upload({
							name: "file",
							path: a
						});
					},
					function(a) {}, {
						filter: "image"
					})
			};

			// 上传文件  
			function upload(file) {
				var wt = plus.nativeUI.showWaiting("上传中，请稍后...");
				var task = plus.uploader.createUpload(UploadHead, {
					method: "POST"
				}, function(t, status) {
					if(status == 200) {
						var result = t.responseText;
						var parseResult = JSON.parse(result);
						//上传完成        
						if(parseResult.code == 0) {
							mymui("上传成功");

							var member = JSON.parse(plus.storage.getItem("member"));
							member.headImg = file.path;
							plus.storage.setItem("member", JSON.stringify(member));
							var tabmy = plus.webview.getWebviewById('tabmy.html');
							mui.fire(tabmy, 'refreshHead');

						} else {
							mymui(parseResult.msg);
						}
					}
					wt.close();
				});
				task.setRequestHeader("token", plus.storage.getItem("tooken"));
				task.setRequestHeader("charset", "utf-8");
				task.addFile(file.path, {
					key: file.name
				});
				task.start();
			}
		</script>
	</body>

</html>